{% extends "TextBadger/base.html" %}

{% load customtags %}

{% block css %}
        <link rel="stylesheet" href="/static/TextBadger/css/task.css">
{% endblock %}

{% block maincontent %}
        {% if isHiddenTask %}
		<div class="ui-state-highlight highlight">This Task is either deleted or is not assigned to you or is not active at the moment</div>
	{% else %}
        <div id="PageHeading">
                <div id="PageName">{{ task.name }}</div>
                <div style='font-size:12px;'>Project: <a href='/project/?pid={{ project.id }}'>{{ project.name }}</a></div>
		<div style='font-size:12px;'>Assigner: <a href='/user/?uid={{ task.assigner.id }}'>{{ task.assigner.firstname }} {{ task.assigner.lastname }}</a></div>
	</div>

	<div id="content" class="overflowshow">
		<div id="questionaire">
			<div style="font-size:13px;font-weight:bold;"><i><u>Answer the following questions based on the document on the right</u></i></div>
			<div id="questions">
			<ol>
				<form action="/task/?tid={{ task.id }}&docid={{ document.id }}" method="POST">
				{% for question in Questions %}
				<li class='questionli'>
					<div class="question">{{ question.question_text }}</div>
					<div class="response">
						{% if question.question_type == 1 %}
						<textarea name="{{ question.question_type }}-{{ question.id }}" required="required"></textarea>
						{% endif %}

						{% if question.question_type == 2 %}
							{% for choice in question.Choices.all %}
							<input name="{{ question.question_type }}-{{ question.id }}" value="{{ choice.id }}" type="radio" />{{ choice.text }}
							{% endfor %}
						{% endif %}

						{% if question.question_type == 3 %}
                	                               	{% for choice in question.Choices.all %}
							<input name="{{ question.question_type }}-{{ question.id }}" value="{{ choice.id }}" type="checkbox" />{{ choice.text }}
							{% endfor %} 
						{% endif %}
					</div>
				</li>
				{% endfor %}
				
				<input type="submit" value="Submit" class="button-base button-blue button-large" />
				</form>
			</ol>
			</div>
		</div>
		<div id="document">
			<iframe src="{{ docurl }}" width="98%">
			</iframe>
		</div>
	</div>
	{% endif %}
{% endblock %}
